<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>dext7r tracker</title>
    <link
      href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css"
      rel="stylesheet"
    />
  </head>
  <body class="bg-gray-100">
    <button
      id="pv"
      class="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded m-4"
    >
      访客上报
    </button>
    <button
      id="screenshot"
      class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded m-4"
    >
      截图上报
    </button>
    <button
      id="jsError"
      class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded m-4"
    >
      js错误上报
    </button>
    <button
      id="promiseError"
      class="bg-pink-500 hover:bg-pink-700 text-white font-bold py-2 px-4 rounded m-4"
    >
      promise错误上报
    </button>
    <button
      tracker-key="h7ml"
      class="bg-yellow-500 hover:bg-yellow-700 text-white font-bold py-2 px-4 rounded m-4"
    >
      dom上报
    </button>
    <!-- <script src="./dist/index.iife.js"></script> -->
    <script src="https://unpkg.com/@dext7r/tracker/dist/index.iife.js"></script>
    <script>
      const tracker = new Tracker({
        uuid: 'h7ml',
        requestUrl: 'https://nestjs.h7ml.cn//system/track',
        historyTracker: true,
        domTracker: true,
        hashTracker: true,
        sdkVersion: new Tracker({}).version,
        jsError: true
      })

      const pv = document.getElementById('pv')
      const screenshot = document.getElementById('screenshot')
      const jsError = document.getElementById('jsError')
      const promiseError = document.getElementById('promiseError')
      pv.addEventListener('click', () => {
        history.pushState('pv', 'pv', '/')
      })

      screenshot.addEventListener('click', () => {
        tracker.captureScreenshot()
      })

      jsError.addEventListener('click', () => {
        console.log(vue)
      })
      promiseError.addEventListener('click', () => {
        const promise = new Promise((resolve, reject) => {
          reject('这是一个严重的 Promise 错误')
        })
      })
    </script>
  </body>
</html>
